<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<style>
    .model {
        width: 500px;
        height: 372px;
        background: url(images/奖状.jpg) no-repeat center;
        margin: 10px auto;
        overflow: hidden;
    }
    .content {
        /* background-color: rgba(10, 20, 30, .3); */
        width: 350px;
        margin: auto;
        margin-top: 130px;
    }
    .content p {
        margin: 8px 0;
    }
    .content p:nth-child(1) span {
        font-size: 1.5em;
    }
    .content p:nth-child(2) {
        text-indent: 2em;
    }
    .content p:nth-child(3) {
        margin-left: 5em;
    }
    .content p:nth-child(3)~p {
        text-align: right;
    }
    .second {
        font-family: 'Courier New', Courier, monospace;
    }
    .third {
        font-family: "宋体";
    }
</style>
<body>
    <div class="model first">
        <div class="content">
            <p><span>逯博博</span>同学：</p>
            <p>在第5届中国程序猿吐槽大会上，过关斩将，荣获大会“一等大嘴奖”。</p>
            <p>特发此证，以资证明！</p>
            <p>中国程序猿吐槽大会组委会</p>
            <p>2025年12月6日</p>
        </div>
    </div>
    <div class="model second">
        <div class="content">
            <p><span>逯博博</span>同学：</p>
            <p>在第5届中国程序猿吐槽大会上，过关斩将，荣获大会“二等大嘴奖”。</p>
            <p>特发此证，以资证明！</p>
            <p>中国程序猿吐槽大会组委会</p>
            <p>2025年12月6日</p>
        </div>
    </div>
    <div class="model third">
        <div class="content">
            <p><span>逯博博</span>同学：</p>
            <p>在第5届中国程序猿吐槽大会上，过关斩将，荣获大会“三等大嘴奖”。</p>
            <p>特发此证，以资证明！</p>
            <p>中国程序猿吐槽大会组委会</p>
            <p>2025年12月6日</p>
        </div>
    </div>
</body>
</html>